<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" >
    <link href="__STATIC__/guess/dist/css/swiper.css" rel="stylesheet" />
    <link rel="stylesheet" href="__STATIC__/guess/dist/css/index3.css">
</head>

<body>
<div class="swiper-container">
    <div class="swiper-wrapper">
        {volist name="match_details" id="vo"}
        <div class="swiper-slide">
            <div class="model">
                <!-- 头部时间 -->
                <div class="proportion">
                    <p class="Games">{$vo.matcheName}</p>
                    <p class="span1">{$vo.start_time}</p>
                </div>
                <hr class="horizontal0" />

                <div class="nation">

                    <div class="China">
                        <img src="{$vo.pic_a}" alt="">
                        <p>{$vo.player_a_name}</p>
                    </div>

                    <!-- VS -->
                    <div class="VS-code">
                        <span>VS</span>
                    </div>

                    <div class="America">
                        <img src="{$vo.pic_b}" alt="">
                        <p>{$vo.player_b_name}</p>
                    </div>

                </div>
                <hr class="horizontal2" />
                <!-- 第一栏 -->
                {if condition="$vo.sf_peilv neq null"}
                <p class="norm">标准胜负</p>
                <div class="outcome">
                    <div class="defeat" onclick="xiazhu(1,'{$vo.id}','{$vo.sf_peilv.id}','{$vo.sf_peilv[\'1_winner_id\']}','{$vo.sf_peilv.jc_type}',1)">
                        <p class="colour">左胜</p>
                        <p class="redness">赔率:{$vo.sf_peilv['1_peilv_sf']}</p>
                    </div>
                    <div class="defeat" onclick="xiazhu(1,'{$vo.id}','{$vo.sf_peilv.id}','{$vo.sf_peilv[\'3_winner_id\']}','{$vo.sf_peilv.jc_type}',1)">
                        <p class="colour">平</p>
                        <p class="redness">赔率:{$vo.sf_peilv['3_peilv_sf']}</p>
                    </div>
                    <div class="defeat" onclick="xiazhu(1,'{$vo.id}','{$vo.sf_peilv.id}','{$vo.sf_peilv[\'2_winner_id\']}','{$vo.sf_peilv.jc_type}',1)">
                        <p class="colour">右胜</p>
                        <p class="redness">赔率:{$vo.sf_peilv['2_peilv_sf']}</p>
                    </div>
                </div>
                {/if}
                <!-- 第二栏 -->
                {if condition="$vo.rf_peilv neq null"}
                <p class="cathectic">让分投注</p>
                <div class="cathectic1">
                    <div class="scale" onclick="xiazhu()">
                        <p class="colour">{$vo.rf_peilv['1_winner_rangfen']}</p>
                        <p class="redness">赔率:{$vo.rf_peilv['1_peilv_rang']}</p>
                    </div>
                    <div class="scale" onclick="xiazhu()">
                        <p class="colour">平</p>
                        <p class="redness">赔率:{$vo.rf_peilv['3_peilv_rang']}</p>
                    </div>
                    <div class="scale" onclick="xiazhu()">
                        <p class="colour">{$vo.rf_peilv['2_winner_rangfen']}</p>
                        <p class="redness">赔率:{$vo.rf_peilv['2_peilv_rang']}</p>
                    </div>
                </div>
                {/if}
                <!-- 第三栏 -->
                {if condition="$vo.zf_peilv neq null"}
                <p class="score">全场总得分</p>
                <div class="score1">
                    <div class="lfet1" onclick="xiazhu()">
                        <p class="colour">大于{$vo.zf_peilv['zongfen']}个</p>
                        <p class="redness">赔率:{$vo.zf_peilv['1_peilv_zong']}</p>
                    </div>
                    <div class="right1" onclick="xiazhu()">
                        <p class="colour">小于{$vo.zf_peilv['zongfen']}个</p>
                        <p class="redness">赔率:{$vo.zf_peilv['2_peilv_zong']}</p>
                    </div>
                </div>
                {/if}
                <!-- 第四栏 -->
                {if condition="$vo.jq_peilv neq null"}
                <p class="goal">是否都进球</p>
                <div class="whether">
                    <div class="yes" onclick="xiazhu()">
                        <p class="colour">是</p>
                        <p class="redness">赔率:{$vo.jq_peilv['1_peilv_jin']}</p>
                    </div>
                    <div class="deny" onclick="xiazhu()">
                        <p class="colour">否</p>
                        <p class="redness">赔率:{$vo.jq_peilv['2_peilv_jin']}</p>
                    </div>
                </div>
                {/if}
            </div>
        </div>
        {/volist}
    </div>
    <div class="swiper-pagination"></div>
</div>

</body>
<script src="__STATIC__/guess/jquery/jquery.min.js"></script>
<script src="__STATIC__/guess/dist/js/swiper.min.js"></script>
<script src="__STATIC__/guess/layer/layer.js"></script>
<script>

    function xiazhu(uid,match_id,jc_id,jc_pl_id,jc_type,tz_type) {
        var pt = '{$pt}';
        if(uid == '0'){
            if(pt == 1){
                // alert('android.jump_login()');
                var id = '1';
                android.jump_login(id);
            }else{
                var id = '1';
                // window.location.href='#{"do":"jump_login","id":"'+id+'"}';
                // window.webkit.messageHandlers.lwdkit.postMessage({'action':'jump_login','id':id});
            }
        }else{
            layer.open({
                id:1,
                type: 1,
                title:'请输入下注金额:',
                area:['250px', 'auto'],
                ,
                btn:['确定','取消'],
                btn1: function (index,layero) {
                    var wager = $(" input[ name='wager'] ").val();
                    var url = "/api/guess/userbet?uid="+uid+"&match_id="+match_id+"&jc_id="+jc_id+"&jc_pl_id="+jc_pl_id+"&jc_type="+jc_type+"&tz_type="+tz_type+"&wager="+wager;
                    $.get(url,function(res){

                        if(res.code == 1){
                            //提示层
                            layer.close(index);
                            layer.msg(res.msg);
                        }
                        if(res.code == 0){
                            layer.msg(res.msg);
                            layer.close(index);
                        }
                    });
                },
                btn2:function (index,layero) {
                    layer.close(index);
                }
            });
        }

    }


    var mySwiper = new Swiper('.swiper-container', {
        direction: 'horizontal',
        //   loop:true,
        // autoplay: 3000,//自动轮播
        speed: 600,
        // 如果需要分页器
        pagination: '.swiper-pagination',
        paginationType: 'custom',//这里分页器类型必须设置为custom,即采用用户自定义配置
        //下面方法可以生成我们自定义的分页器到页面上
        paginationCustomRender: function (swiper, current, total) {
            var customPaginationHtml = "";
            for (var i = 0; i < total; i++) {
                //判断哪个分页器此刻应该被激活
                if (i == (current - 1)) {
                    customPaginationHtml += '<span class="swiper-pagination-customs swiper-pagination-customs-active"></span>';
                } else {
                    customPaginationHtml += '<span class="swiper-pagination-customs"></span>';
                }
            }
            return customPaginationHtml;
        }
    });

</script>
</html>